﻿<%@ page language="java" contentType="text/html; charset=utf-8"
    pageEncoding="utf-8"%>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core"  %>
<!DOCTYPE html>
<html>
<head>
	<meta charset="UTF-8">
	<meta http-equiv="cache-control" content="no-cache">
	<title>个人中心</title>
	<link rel="stylesheet" type="text/css" href="../../plugins/jquery-easyui/themes/metro/easyui.css" />
	<link rel="stylesheet" type="text/css" href="../../plugins/jquery-easyui/themes/icon.css" />
	<link rel="stylesheet" type="text/css" href="../../css/common/common.css" />
	<script type="text/javascript" src="../../plugins/jquery-easyui/jquery.min.js"></script>
	<script type="text/javascript" src="../../plugins/jquery-easyui/jquery.easyui.min.js"></script>
	<script type="text/javascript" src="../../plugins/jquery-easyui/locale/easyui-lang-zh_CN.js"></script>
	<script type="text/javascript" src="../../js/common/common.js"></script>
	<script type="text/javascript" src="../../js/common/validate.js"></script>
	<style type="text/css">
		.user-center{
			width: 400px;
			margin: 90px auto 0px;
		}
		.user-center div{
			margin: 20px 10px;
		}
		.user-center label{
			display: inline-block;
			width: 130px;
			font-size: 12px;
			text-align: right;
			margin-right: 14px;
		}
		.user-center-btn{
			text-align: center;
		}
		.sure-btn,.cancel-btn{
			display: inline-block;
			width: 80px;
			height: 30px;
			font-size: 13px;
			text-align: center;
			text-decoration: none;
			line-height: 30px;
			border-radius: 3px;
			margin: 0px 30px;
		}
		.sure-btn{
			color: #fff;
			background-color: rgba(22, 212, 38, 0.93);
		}
		.cancel-btn{
			color: #fff;
			background-color: #ff2323;
		}
	</style>
</head>
<body>
	<form class="user-center" method="post">
		<div>
			<label>用户名：</label>
			<input type="text" class="easyui-textbox" id="name" name="name" value="${requestScope.userInfo[0].name}"/>
		</div>
		<div>
			<label>账号：</label>
			<input type="text" class="easyui-textbox" name="account" data-options="readonly: true" value="${requestScope.userInfo[0].account}"/>
		</div>
		<div>
			<label>密码：</label>
			<input type="password" class="easyui-textbox" id="pw" name="password" />
		</div>
		<div>
			<label>身份证：</label>
			<input type="text" class="easyui-textbox" name="IDCard" data-options="missingMessage:'身份证号', validType:'IdentityCodeValid',readonly: true" value="${requestScope.userInfo[0].IDCard}" />
		</div>
		<div>
			<label>手机号：</label>
			<input type="text" class="easyui-numberbox" id="phone" name="phone" data-options="prompt:'手机号', validType:'phoneValid'," value="${requestScope.userInfo[0].phone}" />
		</div>
		<div>
			<label>出生年月：</label>
			<input type="text" class="easyui-datebox" id="birthday" name="birthday" data-options="prompt:'出生日期'" value="${requestScope.userInfo[0].birthday}" />   
		</div>
		<div class="user-center-btn">
			<a href="javaScript:update();" class="sure-btn" >确定</a>
			<a href="javaScript:cancel();" class="cancel-btn" >取消</a>
		</div>
	</form>
	<script type="text/javascript">
	
		// 重写easyUI验证框的验证方法
		$.extend($.fn.validatebox.defaults.rules, {    
		    phoneValid: {    
		        validator: function(value, param){    
		           return phoneValid(value);    
		        },    
		        message: '手机号格式错误'   
		    },
		});  
	
		var localData = {birthday: '${requestScope.userInfo[0].birthday}',
						password:  '',
						IDCard: '${requestScope.userInfo[0].IDCard}',
						phone: '${requestScope.userInfo[0].phone}',
						name: '${requestScope.userInfo[0].name}',
						account: '${requestScope.userInfo[0].account}'};
		
		// 修改基本信息
		function update(){
			$.ajax({
				type:"post",
				url:"userCenter/update",
				async:true,
				dataType: 'json',
				data:"name=" + $('#name').val() + "&password=" + $('#pw').val() + "&phone=" + $('#phone').val() + "&birthday=" + $('#birthday').val(), 
				success: function(rs){
			    	if (rs.status == 0){
                    	$.messager.alert("系统提示", rs.msg);
                    } else {
                        $.messager.show({
                            title:'错误提示' + rs.status,
                            msg:rs.msg
                        })
                    }
				}
			});
		}
		
		// 取消修改
		function cancel(){
			$('.user-center').form('load', localData);
		}
	</script>
</body>
</html>